<template>
  <div class="app">
    <BaseForm ref="myForm"></BaseForm>
    <br />
    <button @click="handleGet">获取数据</button>
    &nbsp;&nbsp;&nbsp;&nbsp;
    <button @click="handleReset">重置数据</button>
  </div>
</template>

<script>
import BaseForm from "./components/BaseForm.vue";
export default {
  components: {
    BaseForm
  },
  methods: {
    handleGet() {
      // console.log(document.querySelector("BaseForm")); // 获取不到
      console.log(this.$refs.myForm.getValue());
    },
    handleReset() {
      this.$refs.myForm.reset();
    }
  }
};
</script>

<style scoped>
.app {
  width: 300px;
  height: 200px;
  border: 3px solid #000;
  padding: 50px;
}
</style>